<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width" />
    <meta name="author" content="www.lzqcode.com" />
    <meta name="robots" content="all" />
    <title>日记</title>
    <link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="layui/css/layui.css" />
    <link rel="stylesheet" href="css/master.css" />
    <link rel="stylesheet" href="css/gloable.css" />
    <link rel="stylesheet" href="css/nprogress.css" />
    <link rel="stylesheet" href="css/timeline.css" />

    <script src="js/vue.min.js"></script>
    <script src="js/axios.min.js"></script>
</head>
<body>
<div id="app">

    <div class="header">
    </div>
    <header class="gird-header">
        <div class="header-fixed">
            <div class="header-inner">
                <a href="javascript:void(0)" class="header-logo" id="logo">Mr.liu</a>
                <nav class="nav" id="nav">
                    <ul>
                        <li><a href="index.html">首页</a></li>
                        <li><a href="index.html">博客</a></li>
                        <li><a href="message.html">留言</a></li>
						<li><a href="diary.html">日记</a></li>
                        <li><a href="link.html">友链</a></li>
                    </ul>
                </nav>
                <a href="#" class="blog-user">
                    <i class="fa fa-qq"></i>
                </a>
                <a class="phone-menu">
                    <i></i>
                    <i></i>
                    <i></i>
                </a>
            </div>
        </div>
    </header>
    <div class="doc-container" id="doc-container">
         <div class="container-fixed">
            <div class="timeline-box shadow">
                <div class="timeline-main">
                    <h1><i class="fa fa-clock-o"></i>收藏</h1>
                    <div class="timeline-line"></div>
                        <div class="timeline-year"  v-for="(r,index) in record"><!-- r 别删-->
                            <h2 v-if="index==0"><a >{{record[index].year}}</a><i class="fa fa-caret-down fa-fw"></i></h2><!--第0次，防止越界-->
                            <h2 v-if=" index>0 && record[index].year != record[index-1].year"><a >{{record[index].year}}</a><i class="fa fa-caret-down fa-fw"></i></h2>
                            <div class="timeline-month">
                                <ul>
                                    <li>
                                        <div class="h4 animated fadeInLeft">
                                            <p class="date">{{record[index].begintime}}</p>
                                        </div>
                                        <p class="dot-circle animated "><i class="fa fa-dot-circle-o"></i></p>
                                        <a :href="'read.html?postId='+record[index].id"><div class="content animated fadeInRight">{{record[index].title}}</div></a>
                                        <div class="clear"></div>
                                    </li>
                                </ul>
                            </div>


                        </div>
                </div>
            </div>
        </div>
    </div>
    <footer class="grid-footer">
        <div class="footer-fixed">
            <div class="copyright">
                <div class="info">
                    <div class="contact">
                        <a href="javascript:void(0)" class="github" target="_blank"><i class="fa fa-github"></i></a>
                        <a href="#" class="qq" target="_blank" ><i class="fa fa-qq"></i></a>
                        <a href="#" class="email" target="_blank" ><i class="fa fa-envelope"></i></a>
                        <a href="javascript:void(0)" class="weixin"><i class="fa fa-weixin"></i></a>
                    </div>
                    <p class="mt05">
                        Copyright &copy; 2022-5 Knowledge Forum V.1.0.0 Power by 项目设计
                    </p>
                </div>
            </div>
        </div>
    </footer>
    <script src="layui/layui.js"></script>
    <script src="js/yss/gloable.js"></script>
    <script src="js/plugins/nprogress.js"></script>
    <script>NProgress.start();</script>
    <script src="js/pagediary.js"></script>
    <script> 
        window.onload = function () {
            NProgress.done();
        };
    </script>

</div>
<script>
    var v=new Vue({
        el:"#app",
        data:{
            account:"121314",
            record:[],
        },
        created(){
            axios.get("getPost.s?account="+this.account).then(res=>{

                this.record=res.data;
                console.log("-------------------------------")
                console.log(this.record)

            });
        }
    });
</script>
</body>
</html>
